<template>
  <div>
    <el-card  class="box-card" style="margin-top: 20px">
      <el-row>
        <el-form ref="applyForm" :model="applyForm" :rules="applyRules">
          <el-form-item label="用款金额(万元)" label-width="120px" prop="loanAppSum">
            <el-input v-model="applyForm.loanAppSum" placeholder="请输入用款金额" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="用款期限(月)" label-width="120px" prop="loanAppPeriod">
            <el-input v-model="applyForm.loanAppPeriod" placeholder="请输入用款期限" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="担保受益方" label-width="120px" prop="loanAppUnit">
            <el-input v-model="applyForm.loanAppUnit" placeholder="请输入担保受益方" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="借款人户名" label-width="120px" prop="borrowerAcc">
            <el-input v-model="applyForm.borrowerAcc" placeholder="请输入借款人户名" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="指定账号" label-width="120px" prop="appointAcc">
            <el-input v-model="applyForm.appointAcc" placeholder="请输入指定账号" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="签约金额(万元)" label-width="120px" prop="signSum">
            <el-input v-model="applyForm.signSum" placeholder="请输入签约金额" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="累计放款额(万元)" label-width="120px" prop="loanAllSun">
            <el-input v-model="applyForm.loanAllSun" placeholder="请输入累计放款额" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="可放款金额(万元)" label-width="120px" prop="loanAvlSum">
            <el-input v-model="applyForm.loanAvlSum" placeholder="请输入可放款金额" autocomplete="off"></el-input>
          </el-form-item>
          <el-form-item label="是否提前放款"  label-width="120px">
            <el-select v-model="applyForm.region" placeholder="请选择是否提前放款">
            <el-option label="是" value="1"></el-option>
            <el-option label="否" value="0"></el-option>
          </el-select>
          </el-form-item>
        </el-form>
      </el-row>
      <el-row>
        <div class="myDiv" style="font-size: 14px;">
          <span>用款计划表</span>
        </div>
        <div class="myDiv btnDiv">
          <el-button size="mini" type="primary" @click="handleAdd(scope.$index, scope.row)">新增</el-button>
        </div>
      </el-row>
      <el-row style="margin-top: 10px;">
        <el-table :data="usePlanList" border style="width: 100%">
          <el-table-column type="index" label="序号" align="center" width="50">
          </el-table-column>
          <el-table-column align="center" width="180" label="用款时间">
          </el-table-column>
          <el-table-column align="center" width="180" label="用款额度（万元）">
          </el-table-column>
          <el-table-column align="center" width="280" label="用途">
          </el-table-column>
          <el-table-column align="center" width="180" label="收款单位" type="date">
          </el-table-column>
          <el-table-column align="center" width="180" label="开户行及账号" type="date">
          </el-table-column>
          <el-table-column align="center" label="操作" width="180">
            <template slot-scope="scope">
              <el-button size="mini" type="text" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
              <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-row>

      <!--收费信息和发票信息-->
      <el-row>
        <div class="myDiv" style="font-size: 14px;">
          <span>当前位置：</span>
        </div>
        <div class="myDiv btnDiv">
          <el-button size="mini" type="primary" @click="handleAdd(scope.$index, scope.row)">新增</el-button>
        </div>
      </el-row>
      <el-row>
        <el-tabs type="border-card" @tab-click="changeTab2" v-model="activeName2">
          <el-tab-pane label="收费信息" name="tab3">
            <el-table :data="realChargeList" border style="width: 100%">
              <el-table-column type="index" label="序号" align="center" width="50">
              </el-table-column>
              <el-table-column align="center" width="180" label="类型">
              </el-table-column>
              <el-table-column align="center" width="180" label="金额(元)">
              </el-table-column>
              <el-table-column align="center" width="280" label="收取日期">
              </el-table-column>
              <el-table-column align="center" width="180" label="是否预收">
              </el-table-column>
              <el-table-column align="center" width="180" label="是否开票">
              </el-table-column>
              <el-table-column align="center" width="180" label="发票类型">
              </el-table-column>
              <el-table-column align="center" width="180" label="备注">
              </el-table-column>
              <el-table-column align="center" label="操作" width="180">
                <template slot-scope="scope">
                  <el-button size="mini" type="text" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                  <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                </template>
              </el-table-column>
            </el-table>
          </el-tab-pane>
          <el-tab-pane label="发票信息" name="tab4">
            <el-form ref="invoiceInfoForm" :model="invoiceInfoForm" :rules="invoiceInfoRules">
              <el-form-item label="名称" label-width="130px" prop="clieName">
                <el-input v-model="invoiceInfoForm.clieName" placeholder="请输入名称" autocomplete="off"></el-input>
              </el-form-item>
              <el-form-item label="税号" label-width="120px" prop="loanAppPeidCodeiod">
                <el-input v-model="invoiceInfoForm.loanAidCodeppPeriod" placeholder="请输入税号" autocomplete="off"></el-input>
              </el-form-item>
              <el-form-item label="单位地址" label-width="120px" prop="clieAdress">
                <el-input v-model="invoiceInfoForm.clieAdress" placeholder="请输入单位地址" autocomplete="off"></el-input>
              </el-form-item>
              <el-form-item label="电话号码" label-width="130px" prop="clieTele">
                <el-input v-model="invoiceInfoForm.clieTele" placeholder="请输入电话号码" autocomplete="off"></el-input>
              </el-form-item>
              <el-form-item label="开户银行" label-width="120px" prop="depoBank">
                <el-input v-model="invoiceInfoForm.depoBank" placeholder="请输入开户银行" autocomplete="off"></el-input>
              </el-form-item>
              <el-form-item label="银行账户" label-width="120px" prop="accoNum">
                <el-input v-model="invoiceInfoForm.accoNum" placeholder="请输入银行账户" autocomplete="off"></el-input>
              </el-form-item>
              <el-form-item label="收费情况补充说明" label-width="130px" prop="remarks">
                <el-input type="textarea" :rows="2" v-model="invoiceInfoForm.remarks" placeholder="请输入收费情况补充说明" autocomplete="off"></el-input>
              </el-form-item>
            </el-form>
          </el-tab-pane>
        </el-tabs>
      </el-row>
    </el-card>
    <!-- <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible" :before-close="handleFormClose">
      <el-form :model="applyForm" ref="applyForm">
        <el-form-item label="任务名称"  label-width="120px">
          <el-input v-model="applyForm.taskName" placeholder="请输入意见内容" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="处理人"  label-width="120px">
          <el-input v-model="applyForm.taskName" placeholder="请输入处理人" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="处理时间"  label-width="120px">
          <el-date-picker
            type="datetime"
            placeholder="选择日期"
            v-model="applyForm.createDate"
            :disabled="viewHide"
            style="width: 100%;">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="意见内容"  label-width="120px">
          <el-input type="textarea" :rows="2" v-model="applyForm.content" placeholder="请输入审批意见" autocomplete="off"></el-input>
        </el-form-item>
      </el-form>
    </el-dialog> -->
    <el-card class="box-card" style="margin-top: 20px;">
      <div slot="header" class="clearfix" style=" font-size: 14px;">
        <span>审批意见</span>
      </div>
      <el-form :model="myOpinion" ref="myOpinion">
        <el-row>
          <el-form-item label="我的意见"  label-width="120px">
            <el-input type="textarea" :rows="2" v-model="myOpinion.content" 
              placeholder="请输入审批意见" autocomplete="off"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
        </el-row>
        <div style="text-align:center;width:100%;">
          <el-button type="primary" @click="doSubmit(false)">保存</el-button>
          <el-button type="success" @click="doSubmit(true)">提交</el-button>
        </div>
      </el-form>
    </el-card>
  </div>
</template>
      
<script>
export default {
  components: {
      projHandleDisplay: require("@/pages/biz/proj/projDisplay/projHandleDisplay.vue").default,
  },
  data() {
    return {
      // 用款信息
      applyForm: {},
      applyRules:{
        loanAppSum: [{required: true, message: "请输入用款金额，单位万元", trigger: "blur", pattern: /([0-9]\d*(\.\d*[1-9])?)|(0\.\d*[1-9])/}],
        loanAppPeriod: [{required: true, message: "请输入用款期限，必须是数字", trigger: "blur", pattern: /^([1-9]\d*|[0]{1,1})$/}],
        borrowerAcc: [{required: true, message: "请输入借款人户名", trigger: "blur"}],
        appointAcc: [{required: true, message: "请输入指定账号", trigger: "blur"}],
        loanAppUnit: [{required: true, message: "请输入担保受益方", trigger: "blur"}],
        aheadLoanSum: [{required: true, message: "是否提前放款", trigger: "blur"}],
        loanAllSun: [{message: "请输入金额", trigger: "blur", pattern: /([0-9]\d*(\.\d*[1-9])?)|(0\.\d*[1-9])/}],
        loanAvlSum: [{message: "请输入金额", trigger: "blur", pattern: /([0-9]\d*(\.\d*[1-9])?)|(0\.\d*[1-9])/}],
        signSum: [{message: "请输入金额", trigger: "blur", pattern: /([0-9]\d*(\.\d*[1-9])?)|(0\.\d*[1-9])/}],
      },
      // 用款计划表
      usePlanList: [],
      // 拟态框
      dialogFormVisible: false,
      // 发票信息表单
      invoiceInfoForm: {},
      // 发票信息表单验证
      invoiceInfoRules: {},
      // 我的审批意见
      myOpinion: {},
      // 默认打开的tab内容
      activeName2: 'tab3',
    };
  },
  computed: {},
  mounted() {
      // this.init();
  },
  methods: {
    /**
     * 关闭拟态框
     */
    handleFormClose() {
      this.dialogFormVisible = false;
    },
    /**
     * 拟态框可见
     */
    viewOpinion(item) {
      this.dialogFormVisible = true;
      this.applyForm = item;
    },
    /**
     * tab标签切换
     */
    changeTab2() {

    },
    /**
     * 返回
     */
    back(){
      this.$router.push({path:"/proj/projHandleList"});
    },
    init() {
      //合作银行列表
      this.$refs.entBaseComponentDisplay.init(this.entId);
    },
    save(){
      let projHandle= this.$refs.projHandleComponent.getdata();
      let user=JSON.parse(sessionStorage.getItem("user"));
      projHandle.createUserId=user.id;
      projHandle.createUserName=user.realName;
      projHandle.projApplyId=this.projApplyId;
      this.$api.formPost( 'biz/project/doAcceptance',projHandle).then(res => {
        if(res.retHead.code=="0000000"){
              this.projId=res.retBody;
              if (this.projId) {
                this.isProjMate = false;
              }
              this.$message({
                  type: 'success',
                  message: "保存成功！"
              });
          }else{
            
              this.$message({
                  type: 'error',
                  message: res.retHead.message
              });
          }
      });
    },
    submit(){
      let projHandle= this.$refs.projHandleComponent.getdata();
      let user=JSON.parse(sessionStorage.getItem("user"));
      projHandle.createUserId=user.id;
      projHandle.createUserName=user.realName;
      projHandle.workflowCode="005";
      projHandle.projApplyId=this.projApplyId;
      if(!this.projId){
        this.$message({
                      type: 'error',
                      message: "请先保存，再提交",
            });
            return;
      }
      projHandle.id=this.projId;
      this.$api.formPost( 'biz/project/doStart',projHandle).then(res => {
        console.log(res);
            if(res.retHead.code=="0000000"){
                  this.$message({
                      type: 'success',
                      message: "流程启动成功！"
                  });
              }else{
                
                  this.$message({
                      type: 'error',
                      message: res.retHead.message
                  });
              }
          });
    },
    /**
     * 保存或取消我的审批意见
     */
    doSubmit(isSubmit) {
      let params = {};
      let user = JSON.parse(sessionStorage.getItem("user"));
      let conent="1";
      if (this.myOpinion != null) {
        params.myOpinion = this.myOpinion;
      }
      if (this.taskConclusion != null) {
        params.taskConclusion = this.taskConclusion;
        if (this.taskConclusion === "不通过") {
          conent="2";
        }
        if(this.taskConclusion === "退回"){
          conent="3";
        }
      }
      params.taskWorkitemId = this.taskWorkitem.id;
      if (isSubmit) {
        params.isSubmit = "1";
        params.userId =user.id;
        if (this.addSign) {
          params.sign = this.sign;
          params.signUser = this.signUser;
        }
        if (this.isCc) {
          params.cc = this.cc;
          params.ccUser = this.ccUser;
        }
        params.variables = {
          managerA:this.userAB.userA,
          managerB:this.userAB.userB,
          jl:conent,
        };
      }
      

      if (this.taskTemplate != null && this.taskTemplate.isOpinion !== "0") {
        let project={
          id:this.projectId,
          managera:this.userAB.userA,
          managerb:this.userAB.userB
        }
        // 更新项目主表
        this.$api.formPost( "/api/biz/project/doModById",project).then(res => {
          if (res.retHead.code === "0000000") {
            // 先保存意见，再提交流程
            this.$api.post("wf/opinion/save", this.myOpinion).then(res => {
              if (res.status === "0") {
                this.submitMethod(params);
              }
            });
          }
        });
        
      } else {
        this.submitMethod(params);
      }
    },

    /** */
    submitMethod(params) {
      this.$api.post("wf/submit", params).then(res => {
        console.log(res);
        if (res.status === "0") {
          this.handleFormClose();
          this.$message({
            type: "success",
            message: "保存成功!"
          });
          
          if (params.isSubmit) {
            this.$router.push({
              path: "/mywork/taskLog"
            });
          } else {
            this.getBusinessInfo();
          }
        }
      });
    },
  },
  created() {}
};
</script>
<style lang='scss' scoped>
.el-form-item {
  display: inline-block;
  width: 33%;
}
.el-form-item .el-select {
  width: 100%;
}
.myDiv {
  display: inline-block;
}

.btnDiv {
  float: right;
}
</style>